<!DOCTYPE html>
<html>
<head th:include="include/head">

</head>
<body class="hold-transition sidebar-mini layout-fixed">
	<div class="wrapper">


		<div class="content-wrapper">
			<!-- Content Header (Page header) -->
			<section class="content-header">
				<div class="container-fluid">
					<div class="row mb-2">
						<div class="col-sm-6">
							<h1>目录管理</h1>
						</div>
						<div class="col-sm-6">
							<ol class="breadcrumb float-sm-right">
								<li class="breadcrumb-item"><a href="#">首页</a></li>
								<li class="breadcrumb-item active">目录管理</li>
							</ol>
						</div>
					</div>
				</div>
				<!-- /.container-fluid -->
			</section>
			<section class="content">
				<div class="card card-info">
					<div class="card-header">
						<h3 class="card-title">目录信息管理</h3>
					</div>
					<!-- /.card-header -->
					<!-- form start -->
					<form class="form-horizontal" id="form" method="post"
						th:action="@{/user/menuSave}">
						<input type="hidden" name="id" th:value="${bean.id}" /> <input
							type="hidden" name="pId" th:value="${bean.pid}" />
						<div class="card-body">
							<div class="form-group row">
								<label for="name" class="col-sm-2 col-form-label">目录名称</label>
								<div class="col-sm-10">
									<input type="text" class="form-control" name="name"
										id="name" placeholder="目录名称" aria-required="true"
										th:value="${bean.name}">
										<label class="help-block m-b-none" for="name" id="name-error"><i class="far fa-bell"></i>必填项</label>
								</div>
							</div>
							<div class="form-group row">
								<label for="descritpion" class="col-sm-2 col-form-label">目录描述</label>
								<div class="col-sm-10">
									<input type="text" class="form-control" name="descritpion"
										id="descritpion" placeholder="目录描述" aria-required="true"
										th:value="${bean.descritpion}">
										<label class="help-block m-b-none" for="descritpion" id="descritpion-error"><i class="far fa-bell"></i>必填项</label>
								</div>
							</div>
							<div class="form-group row">
								<label for="url" class="col-sm-2 col-form-label">目录链接</label>
								<div class="col-sm-10">
									<input type="text" class="form-control" name="url"
										id="url" placeholder="目录链接" aria-required="true"
										th:value="${bean.url}">
										<label class="help-block m-b-none" for="url" id="url-error"><i class="far fa-bell"></i>必填项</label>
								</div>
							</div>
							<div class="form-group row">
								<label for="isShow" class="col-sm-2 col-form-label">是否显示</label>
								<div class="col-sm-10">
									<select class="form-control" id="isShow" name="isShow" aria-required="true">
										<option value="">请选择</option>
										<option value="1" th:selected="${bean.isShow}==1">显示</option>
										<option value="0" th:selected="${bean.isShow}==0">隐藏</option>
									</select>
									<label class="help-block m-b-none" for="isShow" id="isShow-error"><i class="far fa-bell"></i>必填项</label>
								</div>
							</div>
							<div class="form-group row">
								<label for="legend" class="col-sm-2 col-form-label">图例</label>
								<div class="col-sm-10">
									<input type="text" class="form-control" name="legend"
										   id="legend" placeholder="图例" aria-required="true"
										   th:value="${bean.legend}">
									<label class="help-block m-b-none" for="legend" id="legend-error"><i class="far fa-bell"></i>必填项</label>
								</div>
							</div>

						</div>
						<!-- /.card-body -->
						<div class="card-footer">
							<button type="submit" class="btn btn-info">保存</button>
							<button type="button" class="btn btn-default float-right" th:attr="data-pid=|${bean.pid}"
								id="back">取消</button>
						</div>
						<!-- /.card-footer -->
					</form>
				</div>
			</section>

		</div>
	</div>
	<!-- ./wrapper -->
	<div th:include="include/foot"></div>
	<script>
	$.validator.setDefaults({
		highlight : function(a) {
			$(a).removeClass("is-valid").addClass(
					"is-invalid");
		},
		success : function(a) {
			$(a).prev().removeClass("is-invalid").addClass(
					"is-valid");
			$(a).html('<i class="fas fa-check"></i>验证成功');
		},
		errorClass:"help-block m-b-none",
// 		validClass:"help-block m-b-none",
		errorPlacement:function(a,b){
			if(b.is(":radio")||b.is(":checkbox")){
				a.appendTo(b.parent().parent().parent())
				}else{
					a.appendTo(b.parent())
					}},
					submitHandler:function(form){loadPage();form.submit();}
	});
		$().ready(function() {
			$("#back").click(function() {
				loadPage();
				let pId=$(this).data('pid');	
				console.log(pId);
				location.href = 'menuList?pId='+pId;
			});
			$("#form").validate({
				rules : {
					name : "required",
					descritpion : "required",
					url:"required",
					isShow:{
						required:true,
						minlength:1
					}
				},
				messages : {
					name : '<i class="far fa-times-circle"></i>请输入目录名称',
					descritpion : '<i class="far fa-times-circle"></i>请输入目录描述',
					url :'<i class="far fa-times-circle"></i>请输入目录链接',
					isShow:'<i class="far fa-times-circle"></i>请选择是否显示'
				}
			});
		});
		loadPage=function(){
			window.parent.loadPage();
		}
	</script>
</body>
</html>